﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>隐藏域传值到后台服务器</title>
    <script src="Scripts/jquery-1.9.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            var ul = document.getElementById('tabs');
            var lis = ul.getElementsByTagName('li');
            //赋初值10表示，假若数据有Bug，后台判断只要不为10，就表示下面的for循环被执行了，方便调试
            var liIndex = 10;
            for (var i = 0; i < lis.length; i++) {
                lis[i].i = i;
                lis[i].onclick = function () {
                    liIndex = this.i + 1;
                    $("#<%=myHiddenField.ClientID %>").val(liIndex);
                }
            };
        })
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div style="color: red; font-size: 25px;">
            先点击超链接，然后点击按钮，最后弹出对话框
        </div>
        <div>
            <ul id="tabs">
                <li id="tab1Demo"><a href="#" name="#tab1">按实验日期查询</a></li>
                <li id="tab2Demo"><a href="#" name="#tab2">按实验室查询</a></li>
                <li id="tab3Demo"><a href="#" name="#tab3">按教师查询</a></li>
                <li id="tab4Demo"><a href="#" name="#tab4">按上课时间段查询</a></li>
                <li id="tab5Demo"><a href="#" name="#tab5">组合条件查询</a></li>
            </ul>
            <asp:HiddenField ID="myHiddenField" runat="server" />
            <div>
                <asp:TextBox ID="txtDemo" runat="server"></asp:TextBox>
            </div>
        </div>
        <div>
            <asp:Button ID="Button1" runat="server" Text="猛击我！" OnClick="Button1_Click" />
        </div>
    </div>
    </form>
</body>
</html>
